<template>
  <div v-loading="isLoading">
    <div class="listWrapper" v-if="listData">
      <div class="topWrapper">
        <div class="shadeBox">
          <div class="logo"></div>
          <div class="inputBox">
            <inputWrapper status="small"></inputWrapper>
          </div>
        </div>
      </div>
      <div class="listContent" v-if="listData.companies.length">
        <ul>
          <li class="listItem" v-for="item in listData.companies" :key="item.id">
            <div class="contentItem">
              <h2>{{item.name}}</h2>
              <div class="space"></div>
              <div class="desc">{{item.info}}</div>
              <div class="info">
                <p><span class="infoTitle">联系人:</span><span class="infoContent">{{item.contact_person}}</span></p>
                <p>
                  <span class="infoTitle">联系方式:</span><span class="infoContent">{{item.contacts}}</span>
                  <span class="infoContent" v-if="item.contacts1&&item.contacts1!=''">{{item.contacts1}}</span>
                </p>
                <p><span class="infoTitle"></span><span
                  class="infoContent webUrl">公司网址:&nbsp;&nbsp;&nbsp;{{item.url}}</span></p>
                <!--<p><span class="infoTitle">公司地址:</span><span class="infoContent">6666666666</span></p>-->
              </div>
              <div class="footerBtn">
                <div class="checkBtn" @click="toInfo(item)">
                  <i class="el-icon-arrow-right"></i>
                </div>
              </div>
            </div>
          </li>
        </ul>
      </div>
      <p class="noListData" v-else>暂无数据</p>
      <div class="pageWrapper" v-if="listData&&listData.paginate&&listData.paginate.pages>1">
        <el-pagination
          @current-change="changePage"
          background
          prev-text="上一页"
          next-text="下一页"
          :current-page="nowNum"
          layout="prev, pager, next"
          :page-count="listData.paginate.pages">
        </el-pagination>
      </div>
    </div>
  </div>
</template>

<script>
    import inputWrapper from '@/components/InputWrapper/index'
    import {getCompanyList} from '../../api/common';

    export default {
        name: 'list',
        components: {
            inputWrapper
        },
        data() {
            return {
                nowNum: 1,
                chooseData: {},
                listData: null,
                isLoading: true
            }
        },
        methods: {
            submitSearch(param) {
                this.chooseData = param
                this.nowNum = 1
                this.getData()
            },
            toInfo(item) {
                this.$router.push({
                    path: './companyInfo',
                    query: {
                        id: item.id
                    }
                })
            },
            getData() {
                this.isLoading = true
                console.log(typeof this.chooseData.type)
                let param = {
                    'data': this.chooseData
                }
                let pages = {
                    pageNum: this.nowNum,
                    pageSize: 9
                }
                getCompanyList(pages, param).then(res => {
                    console.log(res)
                    this.listData = res.data
                    this.companies = res.data.companies
                }).catch(err => {
                    console.log(err)
                }).finally(() => {
                    this.isLoading = false
                })
            },
            changePage(n) {
                this.nowNum = n
                this.getData()
            }
        },
        mounted() {
            this.chooseData = {
                level: this.$route.query.level,
                type: this.$route.query.type,
                inputVal: this.$route.query.val,
            }
            this.getData()
        }
    }
</script>

<style scoped lang="less">
  @import "index.less";
</style>
